<template>
	<view class="examinee-wrap">
		<u-navbar
			backIconColor="#FFFFFF"
			:background="{background: 'linear-gradient(90deg,#615CED,#8286F2)'}"
			:border-bottom="false"
			title="我的考生"
			titleColor="#FFFFFF"
			height="88">
		</u-navbar>

		<view class="examinee-list" v-if="lists.length > 0">
			<view class="examinee-item" v-for="(item,index) in lists" :key="index" @click="sessions(item)">
				<view style="flex: 1;">
					<view class="riqi">{{item.date}}</view>
					<view class="kaosheng">
						<view class="fangdian"></view>
						<view class="renshu">
							考生人数：{{item.examinee ? item.examinee : 0}}人
						</view>
					</view>
					<view class="yipingding">
						<view class="fangdian"></view>
						<view class="renshu" :style="{ color: item.assessed > 0 ? '#01A44B' : '#333333' }">已评定人数：{{item.assessed ? item.assessed : 0}}人</view>
					</view>
					<view class="weipingding">
						<view class="fangdian"></view>
						<view class="renshu" :style="{color: item.not_evaluated > 0 ? '#F02929' : '#333333'}">未评定人数：{{item.not_evaluated ? item.not_evaluated : 0}}人</view>
					</view>
				</view>
				<image src="../../static/ic_arrow_right.png" mode="scaleToFill">
				</image>
			</view>
		</view>

		<view v-else class="empty">
			<image src="../../static/ic_empty.png" mode="aspectFill"></image>
			<view class="empty-text">暂无考生记录~</view>
		</view>
	</view>
</template>

<script>
export default {
	data() {
		return {
			lists: []
		}
	},
	onShow() {
		this.getLists();
	},
	methods: {
		sessions(item) {
			uni.showLoading({
				title: '准备评审...',
				mask: true
			})
			let that = this;
			uni.request({
				url: `${that.$api.baseUrl}${that.$api.candidateList}`,
				method: 'GET',
				timeout: 30000,
				data: {
					id: item.id
				},
				header: {
					'authtoken': that.$auth.token(that.$api.candidateList)
				},
				success(res) {
					if (res.data?.code == 1) {
						uni.navigateTo({
							url: `sessions?id=${item.id}`
						})
					} else {
						uni.showToast({
							title: res.data?.msg || '获取评审失败',
							icon: 'none'
						})
					}
				},
				fail(err) {
					uni.showToast({
						title: '获取评审失败',
						icon: 'none',
					})
				},
				complete() {
					uni.hideLoading()
				}
			})
		},
		getLists() {
			let that = this
			uni.request({
				url: `${that.$api.baseUrl}${that.$api.examinee}`,
				method: 'POST',
				timeout: 30000,
				header: {
					'authtoken': that.$auth.token(that.$api.examinee)
				},
				success(res) {
					if (res.data?.code == 1) {
						that.lists = res.data?.data
					} else {
						uni.showToast({
							title: res.data?.msg || '获取数据失败',
							icon: 'none'
						})
					}
				},
				fail(err) {
					uni.showToast({
						title: '获取数据失败',
						icon: 'none'
					})
				}
			})
		}
	}
}
</script>

<style lang="scss" scoped>
page {
	background-color: #F8F8F8;
}
.examinee-list{
	.examinee-item{
		width: 100%;
		background-color: #FFFFFF;
		display: flex;
		flex-direction: row;
		align-items: center;
		padding: 30rpx;
		margin-bottom: 10rpx;
		.riqi{
			font-size: 28rpx;
			color: #333333;
			line-height: 28rpx;
		}
		.kaosheng{
			display: flex;
			flex-direction: row;
			align-items: center;
			margin-top: 24rpx;
			.fangdian{
				width: 6rpx;
				height: 6rpx;
				background: #615CED;
				margin-left: 10rpx;
			}
			.renshu{
				font-size: 24rpx;
				color: #333333;
				line-height: 24rpx;
				padding-left: 10rpx;
			}
		}
		.yipingding{
			display: flex;
			flex-direction: row;
			align-items: center;
			margin-top: 20rpx;
			.fangdian{
				width: 6rpx;
				height: 6rpx;
				background: #615CED;
				margin-left: 10rpx;
			}
			.renshu{
				font-size: 24rpx;
				line-height: 24rpx;
				padding-left: 10rpx;
			}
		}
		.weipingding{
			display: flex;
			flex-direction: row;
			align-items: center;
			margin-top: 20rpx;
			.fangdian{
				width: 6rpx;
				height: 6rpx;
				background: #615CED;
				margin-left: 10rpx;
			}
			.renshu{
				font-size: 24rpx;
				line-height: 24rpx;
				padding-left: 10rpx;
			}
		}
		image{
			width: 16rpx;
			height: 27rpx;
		}
	}
}
.empty{
	display: flex;
	flex-direction: column;
	align-items: center;
	padding-top: 234rpx;
	image{
		width: 276rpx;
		height: 265rpx;
	}
	.empty-text{
		height: 27rpx;
		font-size: 28rpx;
		font-weight: 500;
		color: #999999;
		line-height: 48rpx;
		margin-top: 33rpx;
	}
}
</style>
